<template>
  <!-- 前端展示 第三步 -->
  <div class="">
    <div class="header" :style="backgroundStyle">
      <div class="tp">
        <div class="logo"><img border="0"
            :src="define.comUrl + pageData.schoolemblemimageobj.url" /></div>
        <h4>{{projectFormItem.projectname}}</h4>
      </div>
    </div>

    <div class="cont">
      <div class="xmjs">
        <b class="bt">项目介绍</b>
        <hr class="xt" />
        <div class="text">
          <b>成果名称：</b>

          <p>
            {{projectFormItem.projectname}}
          </p>

          <b>成果分类：</b>

          <p>{{projectFormItem.achievementtype_name}}</p>

          <b>报送单位：</b>

          <p>{{projectFormItem.affiliatedcollege_name}}</p>

          <b>成果完成人：</b>

          <p>{{projectFormItem.projectcompletionperson_name}}</p>
        </div>
        <video style="width:480px; float:right; margin-top:15px; height:260px; background:#eee;"
          :src="define.comUrl+projectFormItem.videourl_name"
          controls></video>
        <!-- <div class="video1"
          style="width:480px; float:right; margin-top:15px; height:260px; background:#eee;"></div>
        <div class="video2" style="width:96%; height:200px; background:#eee; "></div> -->
        <!--仅手机端显示-->
        <div style="clear:both"></div>
      </div>

      <div class="cgjj">
        <b class="bt">成果简介</b>
        <hr class="xt" />
        <p>
          {{projectFormItem. briefintroduction_name }}
        </p>
      </div>

      <div style="clear:both"></div>

      <div class="sbs">
        <b class="bt">申报书</b>
        <hr class="xt" />
        <div style="margin-top:10px;">
          <ul>
            <div v-for="(item,index) in dataList" :key="index">
              <li v-if="item.compilationtypeid_parentname=='申请书'" @click="goItem(item)">
                {{ item.compilationtypeid_name }}
              </li>
            </div>
          </ul>
        </div>
      </div>

      <div class="cgbg">
        <b class="bt">成果报告</b>
        <hr class="xt" />
        <div style="margin-top:10px;">
          <ul class="lb">
            <div v-for="(item,index) in dataList" :key="index">
              <li v-if="item.compilationtypeid_parentname=='成果报告书'" @click="goItem(item)">
                <span><img src="@/assets/images/web/icon1.png" /></span><a
                  href="javascript:;">{{item.compilationtypeid_name}}</a>
              </li>
            </div>

          </ul>
        </div>
      </div>

      <div class="cgjd">
        <b class="bt">成果鉴定</b>
        <hr class="xt" />
        <div style="margin-top:10px;">
          <div v-for="(item,index) in dataList" :key="index"> <a href="javascript:;"
              v-if="item.compilationtypeid_parentname=='成果鉴定'" @click="goItem(item)"><span><img
                  src="@/assets/images/web/jd1.png" /></span>{{item.compilationtypeid_name}}</a>
          </div>

        </div>
      </div>

      <div style="clear:both"></div>

      <div class="wzlb">
        <b class="bt">教学支撑</b>
        <hr class="xt" />
        <div style="margin-top:10px;">
          <ul class="lbb">
            <div v-for="(item,index) in dataList" :key="index">
              <li v-if="item.compilationtypeid_parentname=='教学支撑'" @click="goItem(item)">
                <a href="javascript:;">{{ item.title }}</a>
              </li>
            </div>

          </ul>
        </div>
      </div>

      <div class="wzlb wyb">
        <b class="bt">获奖及推广</b>
        <hr class="xt" />
        <div style="margin-top:10px;">
          <ul class="lbb">
            <div v-for="(item,index) in dataList" :key="index">
              <li v-if="item.compilationtypeid_parentname=='获奖及推广'" @click="goItem(item)">
                <a href="javascript:;">{{item.title}}</a>
              </li>
            </div>

          </ul>
        </div>
      </div>

      <div style="clear:both"></div>

      <div class="wzlb">
        <b class="bt">媒体报道</b>
        <hr class="xt" />
        <div style="margin-top:10px;">
          <ul class="lbb">
            <div v-for="(item,index) in dataList" :key="index">
              <li v-if="item.compilationtypeid_parentname=='媒体报道'" @click="goItem(item)">
                <a href="javascript:;">{{ item.title }}</a>
              </li>
            </div>

          </ul>
        </div>
      </div>

      <div class="wzlb wyb" style="">
        <b class="bt">培养成效</b>
        <hr class="xt" />
        <div style="margin-top:10px;">
          <ul class="lbb">
            <div v-for="(item,index) in dataList" :key="index">
              <li v-if="item.compilationtypeid_parentname=='培养成效'" @click="goItem(item)"><a
                  href="javascript:;">{{item.title}}</a>
              </li>
            </div>

          </ul>
        </div>
      </div>
    </div>

    <div style="clear:both"></div>

    <div class="footer">
      <p>{{ pageData.imprint }}</p>
    </div>
  </div>
</template>

<script>
import request from "@/utils/request";
export default {
  name: 'project',
  components: {},
  props: {},
  computed: {
    backgroundStyle() {
      return {
        background: `url(${this.define.comUrl}${this.pageData.backgroundthirdobj.url
          })`
      };
    }
  },
  data() {
    return {
      pageData: null,
      projectFormItem: null,
      dataList: []
    };
  },
  created() {
    this.pageData = this.jnpf.storageGet("web_home_data");
    this.projectFormItem = JSON.parse(sessionStorage.getItem('projectFormItem'));
    console.log(this.projectFormItem);
    this.getList();
  },
  mounted() { },
  methods: {
    getList() {
      request({
        url: "/api/example/MzProjectcontent/getList",
        method: "post",
        data: {
          compilationProjectId: this.projectFormItem.id
        }
      }).then(res => {
        this.dataList = res.data.list
      });
    },

    goItem(item) {
      sessionStorage.setItem('projectItem', JSON.stringify(item))
      sessionStorage.setItem('projectArr', JSON.stringify(this.dataList))
      this.$router.push({ path: "/sortContent", query: { isShow: '2' } });
    }
  }
};
</script>
<style src="../../assets/css/styles2.css"  scoped>
</style>
<style lang="scss" scoped>
*,
*:before,
*:after {
  -webkit-box-sizing: initial;
}
</style>
